// 定义主题变量
const baseTheme = {
  '--header-height': '60px',
  '--border-radius': '8px',
  '--spacing-xs': '4px',
  '--spacing-sm': '8px',
  '--spacing-md': '16px',
  '--spacing-lg': '24px',
  '--spacing-xl': '32px',
  '--font-size-xs': '12px',
  '--font-size-sm': '14px',
  '--font-size-md': '16px',
  '--font-size-lg': '18px',
  '--font-size-xl': '20px'
}

// 将基础主题变量合并到每个主题中
export const themes = {
  light: {
    ...baseTheme,
    '--bg-color': '#f5f7fa',
    '--text-color': '#333333',
    '--header-bg': 'rgba(255, 255, 255, 0.95)',
    '--card-bg': '#ffffff',
    '--border-color': '#e5e7eb',
    '--hover-color': '#f8fafc',
    '--shadow-color': 'rgba(0, 0, 0, 0.1)',
    '--primary-color': '#409eff',
    '--secondary-color': '#718096',
    '--success-color': '#67c23a',
    '--warning-color': '#e6a23c',
    '--danger-color': '#f56c6c',
    '--info-color': '#909399',
    '--gradient-start': '#f6f6f6',
    '--gradient-end': '#ffffff',
    '--primary-color-rgb': '64, 158, 255',
    '--container-width': '1440px',
    '--section-gap': '24px'
  },
  dark: {
    ...baseTheme,
    '--bg-color': '#1a202c',
    '--text-color': '#e2e8f0',
    '--header-bg': 'rgba(26, 32, 44, 0.95)',
    '--card-bg': '#2d3748',
    '--border-color': '#4a5568',
    '--hover-color': '#2d3748',
    '--shadow-color': 'rgba(0, 0, 0, 0.3)',
    '--primary-color': '#63b3ed',
    '--secondary-color': '#a0aec0',
    '--success-color': '#67c23a',
    '--warning-color': '#e6a23c',
    '--danger-color': '#f56c6c',
    '--info-color': '#909399',
    '--gradient-start': '#1a1a1a',
    '--gradient-end': '#242424',
    '--primary-color-rgb': '99, 179, 237',
    '--container-width': '1440px',
    '--section-gap': '24px'
  }
}

// 切换主题方法
export const changeTheme = (themeName) => {
  const theme = themes[themeName]
  if (!theme) return false

  try {
    requestAnimationFrame(() => {
      Object.entries(theme).forEach(([key, value]) => {
        document.documentElement.style.setProperty(key, value)
      })
    })
    return true
  } catch (error) {
    console.error('Theme change failed:', error)
    return false
  }
}

// 系统主题监听
export const watchSystemTheme = (callback) => {
  const mediaQuery = window.matchMedia('(prefers-color-scheme: dark)')
  
  const handleChange = (e) => {
    const theme = e.matches ? 'dark' : 'light'
    if (callback) callback(theme)
    return theme
  }

  // 使用 addEventListener 替代 addListener (已废弃)
  mediaQuery.addEventListener('change', handleChange)
  
  // 返回当前系统主题
  return mediaQuery.matches ? 'dark' : 'light'
}

// 自动判断主题
export const autoTheme = () => {
  const hour = new Date().getHours()
  const savedTheme = localStorage.getItem('theme')
  
  // 优先使用保存的主题设置
  if (savedTheme) return savedTheme
  
  // 其次使用系统主题设置
  const systemTheme = watchSystemTheme()
  if (systemTheme) return systemTheme
  
  // 最后根据时间判断
  return (hour >= 20 || hour < 6) ? 'dark' : 'light'
} 